@import "flex";

@mixin usePadding($x,$y) {
  padding: #{$y}rpx #{$x}rpx;
  box-sizing: border-box;
}

@mixin useFlex($principalAxis,$crossAxis,$direction:"row",$warp:"nowrap",$gap:0) {
  display: flex;
  flex-direction: unquote(#{$direction});
  flex-wrap: unquote(#{$warp});
  gap: $gap;
  justify-content: unquote(#{$principalAxis});
  align-items: unquote(#{$crossAxis});
}


$page-bg-color: #f5f5f5;
$primary-color: #ee6d46;
$tips-color: #999;
$white-color: #fff;
$black-color: #000;

.primary-color {
  color: $primary-color;
}

.animation-button, .primary-button {
  &.disabled {
    background: $tips-color;
  }
}

.animation-button {
  background: $primary-color;
  color: $white-color;
  transition: all .3s;

  &:active {
    scale: 1.1;
  }
}

.primary-button {
  background: $primary-color;
  color: $white-color;
}

.h5-tabbar-height {
  width: 100%;
  height: var(--window-bottom); // docs https://zh.uniapp.dcloud.io/matter.html#h5-%E5%BC%80%E5%8F%91%E6%B3%A8%E6%84%8F
}

.tabbar-height {
  height: 118rpx;
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
}
